<%- include('header') -%>
<%- include nav %>
<style>
.form_sign {
    max-width: 330px;
    padding: 15px;
    margin: 0 auto;
 }    
</style>
<div class="container">
  
<div class="form_sign">
<div class="panel panel-default">
    <div class="panel-heading">登陆界面</div>
    <div class="panel-body">
            <form role="form" method="post" onsubmit="return false">
                <div class="con"></div>
               
                <div class="form-group">
                    <label for="username">用户名:</label>
                    <input id="username" name="username" type="text" class="form-control" placeholder="请输入用户名">
                </div>
                <div class="form-group">
                    <label for="password">密码:</label>
                    <input id="password" name="password" type="password" class="form-control" placeholder="请输入密码">
                </div>
                <!--<div class="checkbox">
                    <label>
                        <input type="checkbox" id="checkbox" class="checkbox">记住密码
                    </label>
                </div>-->
                <!--<div class="img">
                    <input type="text" value="请输入验证码">
                    <img>
                </div>-->
                <button id="login" class="btn btn-block btn-primary">
                    登录
                </button>
                
            </form>
      </div>
    <div class="panel-footer"><a href="signup">立即注册</a></div>
</div>

</div>



</div>
<script>
    
    var token = window.localStorage.getItem('token');
    //检查用户名是否存在
    function validation(data) {
        if (data.status == 1) {
            var con = '<div id="myAlert" class="alert alert-warning">'
                     +'<a href="#" class="close" data-dismiss="alert">&times;</a>'+ data.msg
                     +'</div>';
                     console.log(data.msg);
                     $('.con').append(con);
                        //延迟关闭警告框
                      window.setTimeout(function(){
                      $('[data-dismiss="alert"]').alert('close');
                      },2000);

        } else if (data.status == 2) {
            var con = '<div id="myAlert" class="alert alert-warning">'
                     +'<a href="#" class="close" data-dismiss="alert">&times;</a>'+ data.msg
                     +'</div>';
                     console.log(data.msg);
                     $('.con').append(con);
                     //延迟关闭警告框
                     window.setTimeout(function(){
                     $('[data-dismiss="alert"]').alert('close');
                     },2000);
        } else if (data.status == 0) {
                      console.log('成功登录');
                      window.localStorage.setItem('token', data.token);
        }

    }

 
        
  function checklogin() {
            var username = $("#username").val();
            var password = $("#password").val();
            var data = {
                "username": username,
                "password": password
            };
            //验证用户名或者密码
            if (username == "" || password == "") {
                alert("用户名或密码不能为空");
                $("#username").focus();
                return false;
           }
         $.ajax({
                url: 'http://localhost:3000/api/auth',
                type:'post',
                timeout: 3000,
                data: data,
                
                headers: {'x-access-token': token},//通过请求头来发送token

                success: function(data) {

                    validation(data);
                 
                },
          
                
            });


    }    

     $("button#login").click(function(e) {
            e.preventDefault();
            checklogin();      
     });
        
</script>
